﻿/**
 * zebron
 * Wifi 配置界面
 */

namespace WifiSpace
{
    export class WifiSetPage implements UiFramework.IState
    {
        stateMgr: UiFramework.StateMgr;
        divSelf: HTMLDivElement;
        onInit(smgr: UiFramework.StateMgr)
        {
            this.stateMgr = smgr;
            this.divSelf = document.createElement("div");
            this.stateMgr.div.appendChild(this.divSelf);

            // 头部 div
            var headDiv = document.createElement("div");
            headDiv.style.position = "absolute";
            headDiv.style.width = "100%";
            headDiv.style.height = "7%";
            headDiv.style.lineHeight = "45px";
            headDiv.style.overflow = "hidden";
            document.body.appendChild(headDiv);

            // 头部 title
            var title = document.createElement("tit");
            title.textContent = "WIFI配置";
            title.style.height = "100%";
            title.className = "configurationDetailTit";
            headDiv.appendChild(title);

            // 头部返回按钮
            var btnReturn = document.createElement("img");
            btnReturn.src = "picture/return.png";
            btnReturn.className = "configurationDetailReturn";
            headDiv.appendChild(btnReturn);

            // 灰色框
            let grayFrame = document.createElement("div");
            grayFrame.className = "grayFrameShow";
            grayFrame.style.top = "24%";
            grayFrame.style.left = "20%";
            this.divSelf.appendChild(grayFrame);

            // WIFI 账号
            let txtTitle = document.createElement("text");
            txtTitle.innerText = "WIFI账号";
            txtTitle.style.position = "absolute";
            txtTitle.style.top = "26%";
            txtTitle.style.left = "45%";
            txtTitle.style.height = "50%";
            this.divSelf.appendChild(txtTitle);

            // 账号输入框
            let accountFrame = document.createElement("input");
            accountFrame.placeholder = "账号";
            accountFrame.style.position = "absolute";
            accountFrame.style.top = "31%";
            accountFrame.style.width = "54%";
            accountFrame.style.height = "20px";
            accountFrame.style.left = "23%";
            accountFrame.style.background = "#EBEBEB";
            accountFrame.style.borderColor = "#549788";
            accountFrame.className = "inputLine";
            this.divSelf.appendChild(accountFrame);

            // 密码输入框
            let pwdFrame = document.createElement("input");
            pwdFrame.placeholder = "密码";
            pwdFrame.style.position = "absolute";
            pwdFrame.style.top = "36%";
            pwdFrame.style.width = "54%";
            pwdFrame.style.height = "20px";
            pwdFrame.style.left = "23%";
            pwdFrame.style.background = "#EBEBEB";
            pwdFrame.style.borderColor = "#549788";
            pwdFrame.className = "inputLine";
            this.divSelf.appendChild(pwdFrame);

            // 底部完成按钮
            let btnFinish = document.createElement("ensure");
            btnFinish.textContent = "搜索配置";
            btnFinish.className = "configurationDetailTit";
            btnFinish.style.paddingBottom = "3.5%";
            btnFinish.style.paddingTop = "3.5%";
            btnFinish.style.bottom = "0";
            this.divSelf.appendChild(btnFinish);

            // 点击跳转验证页面
            btnFinish.onclick = () =>
            {
                this.stateMgr.changeStateByName("configureDetailsUI");
            }
        }

        // 界面传值
        onMessage(meassge: any)
        {

        }

        // 界面隐藏
        onHide()
        {
            this.stateMgr.div.removeChild(this.divSelf);
        }

        // 界面恢复
        onRecover()
        {
            this.stateMgr.div.appendChild(this.divSelf);
        }

        // 主机物理按键事件
        onEvent(event: UiFramework.SmartEvent)
        {
        }

        onExit()
        {
            this.stateMgr.div.removeChild(this.divSelf);
        }
    }
}

UiMap["wifiSetPage"] = () =>
{
    return new WifiSpace.WifiSetPage();
}